import { PureComponent } from "react";
import { Button, Modal,Checkbox} from "antd-mobile"
import { connect } from 'dva';
import { ActivityIndicator } from 'antd-mobile';
import { handleImg, goToPage,backToPrevious } from "../../utils/helper";
import { InputItem } from 'antd-mobile';
import { isNull } from '../../utils/helper';
import {IntlProvider, addLocaleData,FormattedMessage} from 'react-intl';
import localeData from '../../../public/lang/data.json';
import MToast from '../../components/Util/MToast';
const CheckboxItem = Checkbox.CheckboxItem;
const alert = Modal.alert;
@connect(() => {
  return ({

  })
})
export default class AddressList extends PureComponent {
  constructor(props){
    super(props);
    this.state = {
      addressItems:[],
      loading:true,
    }
  }
  componentWillMount(){
    let {dispatch,location} = this.props;

    dispatch({
      type: "global/setHeaderTitle",
      payload: {
        title: localeData[localStorage.locale].addressListTitle,
        path: location.pathname + location.search
      }
    });
  this.AddressList();


  }
  AddressList=()=>{
    let {dispatch,location} = this.props;
    dispatch({
      type: "form/query",
      payload: {
        apiInfo: {
          url: "/qry/all?_c=app_user_address_list",
          params: [
          ],
          _c: "app_user_address_list"
        },
        callback: (result) => {
          let{addressItems}=this.state;
          let { data } = result;
          this.setState({
            loading: false,
            addressItems:data
          })
          console.log(addressItems,data)
        }
      }
    })
  }
  handleAddress=(item,item1)=>{
    let {dispatch} = this.props;
    console.log(item);
    // Toast.info(JSON.stringify(item));
    localStorage.setItem(MI_APP_CODE + "cart_address",JSON.stringify(item));
    localStorage.setItem("saveId",item.id);
    backToPrevious();
    // localStorage.setItem("list_id",item.id);
    //    goToPage({ dispatch, config: { url: "/placeOrder" }, isReplace: false })
  }
  renderList() {
    let { addressItems} = this.state;
    let {dispatch} = this.props;

    if (!addressItems || addressItems.length == 0) {
      return (
        <div style={{ padding: "40px 0", textAlign: "center", fontSize: "20px", color: "#555" }}>
          {T(localeData[localStorage.locale].goodsDetailCartNoGood)}
        </div>
      )
    }
    else {
      console.log(addressItems)
      let contents = [];
      return (
          <div>
            {addressItems.map((item,k)=>{
              console.log(k)
              console.log(item.id,Number(localStorage.getItem("saveId")))
              return(

                <div key={k} data-flex="main:center cross:center box:last"
                  style={{color:(item.id===Number(localStorage.getItem("saveId")))?'blue':'',borderBottom:'1px solid #ddd',paddingBottom:'5px',fontSize:'16px'}}

                  // onClick={(item,k,e)=>{
                  //   console.log(k,item,e)
                  //   localStorage.setItem("list_id",item.id);
                  //   // goToPage({ dispatch, config: { url: "/placeOrder" }, isReplace: false })
                  //
                  // }}
                >
                  <div  onClick={this.handleAddress.bind(this.item,item)}>
                    <p style={{margin:'10px 0 5px'}}>{item.country} {item.district} {item.city} {item.street}</p>
                    <p style={{marginBottom:'5px'}}>{item.recivier}+39{item.concat}</p>
                    <p style={{marginBottom:'5px'}}>{item.post_code}</p>
                  </div>
                  <div>
                    <img src="image/cart_edit.png" alt="" style={{ width: "24px", marginLeft: "10px" }} onClick={()=>{
                      if (browser.isInApp) {
                        Func.registerHanderBridge("callbackCloseWindow", this.AddressList);
                      }
                      goToPage({ dispatch, config: { url: "/modifyAddress?id="+item.id }, isReplace: false })
                    }}/>
                  </div>
                </div>
              )

            })}
          </div>
      )
    }
  }
  render(){
    let {dispatch} = this.props;
    let {loading,modal2,currentQuantity,modal3,currentItem_id,addressItems} = this.state;
    const messages = localeData[localStorage.locale];
    if (loading) {
      return (
        <div className="normal">
          <ActivityIndicator toast text="正在加载" animating={true} />
        </div>
      )
    }
    return(
      <IntlProvider
        locale={ localStorage.locale } messages={messages}
      >
      <div className="normal" style={{ background: "#fff", }}>
        <div style={{margin:"10px"}}>
          {this.renderList()}
        </div>
        <div style={{ height: "50px", position: "fixed", bottom: 0, width: "100%",}} data-flex="cross:center main:justify">
          <Button size="default" type="primary" style={{ padding: "0 10px", background:'#F09600',border:'0',borderRadius:'20px', fontSize: "18px",width:"100%",height:'42px',lineHeight:'42px' }} onClick={() => {
            if (browser.isInApp) {
              Func.registerHanderBridge("callbackCloseWindow", this.AddressList);
            }
            goToPage({ dispatch, config: { url: "/addAddress" }, isReplace: false }) }}>
            {T("+"+messages.addressListAddress)}
            </Button>
        </div>
      </div>
      </IntlProvider>
    )
  }
}

